<!-- 运费管理 -->
<template setup>
  <div class="dashboard-container waybill-list customer-list-box">
    <div class="freight">
      <el-row>
        <el-button class="btn">新增模版</el-button>
      </el-row>
      <el-table :data="list">
        <el-table-column
          label="模版类型"
          width="191"
          height="55px"
          prop="templateType"
        >
        </el-table-column>
        <el-table-column
          label="运送类型"
          width="163.08"
          prop="transportType"
        >
        </el-table-column>
        <el-table-column
          label="关联城市"
          width="282.25"
          prop="associatedCityList"
        >
        </el-table-column>
        <el-table-column
          label="首重"
          width="110.81"
          prop="firstWeight"
        >
        </el-table-column>
        <el-table-column
          label="续重"
          width="110.81"
          prop="continuousWeight"
        >
        </el-table-column>
        <el-table-column
          label="轻抛系数"
          width="145"
          prop="lightThrowingCoefficient"
        >
        </el-table-column>
        <el-table-column
          label="操作"
          width="129"
          align="center"
        >
          <template>
            <a
              data-v-6aab88ea=""
              class="el-link el-link--primary"
            >
              <span
                class="el-link--inner"
                @click="handleEdit(scope.$index, scope.row)"
              >编辑</span>
            </a>

            <div
              data-v-6aab88ea=""
              class="el-divider el-divider--vertical"
            ></div>
            <a
              data-v-6aab88ea=""
              class="el-link el-link--danger"
            >
              <span
                class="el-link--inner"
                @click="handleDelete(scope.$index, scope.row)"
              >删除</span>
            </a>

          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { freightManagement } from '@/api/freight'
export default {
  name: 'Freight',
  data() {
    return {
      list: [] // 运费管理列表
    }
  },
  created() {
    this.getdata()
  },
  methods: {
    // 渲染运费管理列表
    async getdata() {
      // 1.接口调用
      const res = await freightManagement()
      // 2.数据赋值
      this.list = res.data
    },
    // 编辑
    handleEdit(index, row) {
      console.log(index, row)
    },
    // 删除
    handleDelete(index, row) {
      console.log(index, row)
    }
  }
}
</script>

<style lang="scss" scoped rel="stylesheet/scss">
.waybill-list {
  .el-dialog__wrapper {
    ::v-deep .el-dialog__body {
      padding-left: 0px;
    }
  }
    .freight {
      width: 1190px;
      height: auto;
      margin-left: 20px;
      background: #FFFFFF;
      border-radius: 4px;
      padding-left: 30px;
      .btn{
        width: 100px;
        height: 40px;
        font-size: 14px;
        margin-top: 24.38px;
        margin-bottom: 35.63px;
        color: white;
        background: #E15536;
        border-radius: 4px;
      }
    }
  .title{
    font-family: PingFangSC-Medium;
    font-size: 14px;
    color: #818693;
    letter-spacing: 0;
    line-height: 22px;
    font-weight: 500;
    margin: 16.5px 0px 16.5px 16px;
    .text{
      font-family: PingFangSC-Regular;
      font-size: 13px;
      color: #20232A;
      letter-spacing: 0;
      line-height: 22px;
      font-weight: 400;
    }
  }

}

</style>
